import React from 'react';
import {Button, Card, Spin, Icon, Alert} from 'antd';


export default class Loading extends React.Component {

  render() {
    const icon = <Icon type="plus" style={{fontSize: 24}}/>;
    const iconLoading = <Icon type="loading" style={{fontSize: 24}}/>;
    return (
      <div className="">
        <Card title="spin用法">
          <div>
            <Spin size="small"/>
            <Spin size="default"/>
            <Spin size="large"/>
            <Spin indicator={icon}/>
          </div>
        </Card>

        <Card title="Alert">
          <Alert 
            message="react"
            description="react-react-react-antd"
            type="info"
          />
          <Alert 
            message="react"
            description="react-react-react-antd"
            type="error"
          />
          <Spin indicator={iconLoading}>
            <Alert 
              message="react"
              description="react-react-react-antd"
              type="warning"
            />
          </Spin>
          <Spin size="default" tip="加载中...">
            <Alert 
              message="react"
              description="react-react-react-antd"
              type="success"
            />
          </Spin>
        </Card>
      </div>
    );
  }
}